<!--
 * @Author: TANGB02 13233582+Ace-Tang@user.noreply.gitee.com
 * @Date: 2024-03-10 13:46:37
 * @LastEditors: TANGB02 13233582+Ace-Tang@user.noreply.gitee.com
 * @LastEditTime: 2024-03-11 11:18:30
 * @FilePath: \ycq\ycq\ycq1.0\src\pages\nav\news.vue
 * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%A
-->
<template>
  <div class="latest">
    <div class="cnt" @click="() => newsDetails(id)">
      <div class="left-cnt">领养须知....</div>
      <div class="right-cnt">2014-2-11</div>
    </div>
  </div>
</template>

<script setup>
import { ref } from "vue";
import { useRouter } from "vue-router";
const router = useRouter();
const newsDetails = (id) => {
  // 跳转路由  传id
  router.push({ name: "news" });
};
</script>
<style scoped>
.latest {
  display: flex;
  flex-flow: column nowrap;
  width: 100%;
  max-height: 1300px;
  background-color: aliceblue;
  padding: 20px;
  .cnt {
    display: flex;
    flex-flow: row nowrap;
    justify-content: space-between;
    padding: 15px 20px;
    border-bottom: 1px dashed #d4cfca;
    overflow: hidden;
    cursor: default;
    .left-cnt {
      float: left;
      font-size: 14px;
      color: #816d65;
      width: 500px;
    }
    .right-cnt {
      float: right;
      font-size: 14px;
      color: #816d65;
    }
  }
}
</style>
